<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/echarts.js"></script>
    <script src="../js/jquery-1.8.0.min.js"></script>
</head>

<body>
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));

        $.getJSON("http://localhost:8080/MavenDemo_Web_exploded/financeServlet?opr=select", function (data) {
            var data1 = data
            $.post("http://localhost:8080/MavenDemo_Web_exploded/financeServlet?opr=data", function (data) {
                var keys = [];
                var value = [];
                var json = $.parseJSON(data)
                for (var ke in json) {
                    var key = json[ke].fangshi;
                    for(var k of data1){
                        if(k.id==key){
                            console.log(k.name)
                            keys[ke]=k.name
                        }
                    }
                    // if(data1[ke].id==json[ke].fangshi){
                    //     key[ke]=data1[ke].name
                    // }
                    value[ke] = json[ke].count;
                }

                var option = {
                    xAxis: {
                        type: 'category',
                        data: keys
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: [
                        {
                            data: value,
                            type: 'line',
                            smooth: true
                        }
                    ]
                };

                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
            })

        })
        // 指定图表的配置项和数据

    </script>
</body>

</html>